<template>
  <div>
    <div style="font-size: 80px; text-shadow: 0 0 10px black;margin-top: 50px;
        color: white; text-align: center;">
      欢迎你，{{user.roleId == 2 ? "管理员" : (user.roleId == 1 ? "经理" : "")}}<span style="color: red">❤</span>
      <br/>
      {{dateFormat(date)}}
    </div>
  </div>
</template>

<script>
export default {
  name: "AdminHome",
  data() {
    return {
      user: {},
      date:new Date()
    }
  },
  created() {
    this.loadUserData();
  },
  mounted() {
    this.timer = setInterval(() => {
      this.date = new Date(); // 修改数据date
    }, 1000)
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); // 在Vue实例销毁前，清除我们的定时器
    }
  },
  methods: {
    dateFormat(time) {
      var date=new Date(time);
      var year=date.getFullYear();
      /* 在日期格式中，月份是从0开始的，因此要加0
      * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
      * */
      var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
      var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
      var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
      var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
      var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
      // 拼接
      return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
    },
    loadUserData() {
      this.request.get("/admin/user/me").then(res => {
        if (res.code == 200) {
          this.user = res.data;
        }
      });
    }
  }
}
</script>

<style scoped>

</style>
